import router from '@/router'
import store from './store'
// import { asyncRoutes } from '@/router'

// 配置路由守卫
router.beforeEach(async(to, form, next) => {
  const token = store.state.user.token
  if (token) {
    if (to.path === '/login') {
      // 存在token且在登陆页，应该跳转到首页
      next('/')
    } else {
      // 其他情况，放行

      // 这里是确定了用户已经登录，进入了其他页面，需要在这，进入页面之前获取数据
      // 因为从一个页面跳转到另一个页面的时候，都会请求一次，这里需要做判定vuex中是否有值
      if (!store.state.user.profile) {
        await store.dispatch('user/getProfile')
        // 这里是获取完整数据的位置
        // 这里就可以进行路由数组
        // 1，拿到所有的动态路由数组
        // 2.拿到这个用户的 menus 数组
        // 通过动态路由的name 是否存在于 menus ，存在，可以进行访问，不存在，404页面
        // const menus = store.state.user.profile.roles.menus
        // TODO 未理解（不清楚有何不同）
        // !从字符串中寻找数组中的数据，这个是行不通的
        // const routes = asyncRoutes.filter(item => item.name.includes(menus))
        // ? 从数组中去寻找字符串是否匹配
        // const routes = asyncRoutes.filter(item => menus.includes(item.name))
        const routes = await store.dispatch('permission/filtersRoutes')
        // 解决页面刷新的时候出现404（放在动态路由的后面），但又有新得问题（页面刷新出现白色页面）
        router.addRoutes([...routes, { path: '*', redirect: '/404', hidden: true }])
        // 解决刷新变成白色页面的问题
        next(to.path)// 重新触发
        return // 阻止下面的next()
      }
      next()
    }
  } else {
    const whiteList = ['/login', '/404']
    // 可以使用whiteList.includes(to.path) ==> 返回的是布尔值
    if (whiteList.indexOf(to.path) !== -1) {
      // 存在白名单，放行
      next()
    } else {
      // 不存在白名单，跳转到登录页
      next('/login')
    }
  }
})
